
<%@taglib uri="http://java.sun.com/jsf/core" prefix="f"%> 
<%@taglib uri="http://java.sun.com/jsf/html" prefix="h"%> 
<%@taglib uri="http://richfaces.org/a4j" prefix="a4j"%> 
<%@taglib uri="http://richfaces.org/rich" prefix="rich"%>


<div id="seccionDiv">
    <f:subview id="seccionSubView">
        <h:form>
            
            <rich:tabPanel switchType="ajax">
                <rich:tab label="Agregar" actionListener="#{seccionBean.resetearBean}">        
                    
                    <rich:spacer height="20px" style="border:0px"/>
                    <h:outputText value="Selecciona una asignatura"/>
                    
                    <rich:dataTable value="#{seccionBean.asignaturaItems}" var="asignatura" id="table" width="100%">    
                        <rich:column sortable="false" style="text-align:center;">
                            <f:facet name="header">
                                <h:outputText value="Seleccionar"/>
                            </f:facet>
                            <a4j:commandButton value="" action="#{seccionBean.updateAsignatura}" reRender="selectedAsig" >
                                <f:param name="idAsignatura" value="#{row}"/>
                            </a4j:commandButton>
                        </rich:column >
                        <rich:column width="100px" sortBy="#{asignatura.idAsignatura}" filterBy="#{asignatura.idAsignatura}" filterEvent="onkeyup">
                            <f:facet name="header">
                                <h:outputText value="Clave"/>
                            </f:facet>
                            <h:outputText value="#{asignatura.idAsignatura}"/>
                        </rich:column> 
                        
                        <rich:column width="300px" sortBy="#{asignatura.descripcion}" filterBy="#{asignatura.descripcion}" filterEvent="onkeyup">
                            <f:facet name="header">
                                <h:outputText value="Nombre"/>
                            </f:facet>
                            <h:outputText value="#{asignatura.descripcion}"/>
                        </rich:column> 
                        
                        <rich:column style="text-align:center;">
                            <f:facet name="header">
                                <h:outputText value="Creditos"/>
                            </f:facet>
                            <h:outputText value="#{asignatura.creditos}"/>
                        </rich:column>
                        
                        <rich:column style="text-align:center;">
                            <f:facet name="header">
                                <h:outputText value="Estado"/>
                            </f:facet>
                            <h:outputText value="#{asignatura.idEstado.descripcion}"/>
                        </rich:column>
                    </rich:dataTable>
                    
                    <rich:spacer height="20px" style="border:0px"/>
                    
                    <h:panelGrid columns="2" width="450" cellspacing="0" cellpadding="4" border="0" columnClasses="textRight,textLeft">
                        <h:outputText id="selectedAsig" value="Asignatura seleccionada:" style="font-weight:bold;"/>
                        <h:outputText value="#{seccionBean.selectedAsignatura.idAsignatura}  #{seccionBean.selectedAsignatura.descripcion}" />
                        <h:outputText value="Profesor:" style="font-weight:bold;"/>
                        <h:inputText value="#{seccionBean.seccion.profesor}" />
                    </h:panelGrid>
                    
                    <h:outputText value="Seleccione los horarios"/>
                    <a4j:outputPanel>
                        <rich:dataTable id="horarioTable" value="#{seccionBean.clasesList}" var="clase" rowKeyVar="row">
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="#"/>
                                </f:facet>
                                
                                
                                <h:outputText value="#{row + 1}"/>
                            </rich:column>
                            
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="-"/>
                                </f:facet>
                                
                                <h:selectBooleanCheckbox value="#{clase.selected}"/>
                            </rich:column>
                            
                            <rich:column width="150px">
                                <f:facet name="header">
                                    <h:outputText value="Dia"/>
                                </f:facet>
                                
                                <rich:inplaceSelect value="#{clase.dia}"
                                                    defaultLabel="Click para editar" openOnEdit="true"
                                                    showControls="true" editEvent="onclick" layout="block" selectWidth="100"
                                                    viewClass="inplaceSelect" changedClass="inplaceSelect" viewHoverClass="hover" listWidth="100"
                                                    >
                                    <f:selectItems value="#{seccionBean.diasItems}"/> 
                                    <a4j:support event="onviewactivated" reRender="horarioTable"/>
                                </rich:inplaceSelect>
                            </rich:column>
                            
                            <rich:column width="150px">
                                <f:facet name="header">
                                    <h:outputText value="Hora Inicio"/>
                                </f:facet>
                                
                                <rich:inplaceSelect value="#{clase.horaInicio}"
                                                    defaultLabel="Click para editar" openOnEdit="true"
                                                    showControls="true" editEvent="onclick" layout="block" selectWidth="100"
                                                    viewClass="inplaceSelect" changedClass="inplaceSelect" viewHoverClass="hover" listWidth="100"
                                                    >
                                    <f:selectItems   value="#{seccionBean.horasItems}" />
                                    <a4j:support event="onviewactivated" reRender="horarioTable"/>
                                </rich:inplaceSelect>
                            </rich:column>
                            <rich:column width="150px">
                                <f:facet name="header">
                                    <h:outputText value="Dia"/>
                                </f:facet>
                                
                                <rich:inplaceSelect value="#{clase.horaFin}"
                                                    defaultLabel="Click para editar" openOnEdit="true"
                                                    showControls="true" editEvent="onclick" layout="block" selectWidth="100"
                                                    viewClass="inplaceSelect" changedClass="inplaceSelect" viewHoverClass="hover" listWidth="100"
                                                    >
                                    <f:selectItems value="#{seccionBean.horasItems}" /> 
                                    <a4j:support event="onviewactivated" reRender="contactTable"/>
                                </rich:inplaceSelect>
                            </rich:column>
                        </rich:dataTable>
                        
                        <rich:spacer height="10"/>
                        
                        <h:panelGrid columns="2">
                            <a4j:commandButton value="Agregar" actionListener="#{seccionBean.agregarClase}" reRender="horarioTable" style="border:0px;"/>
                            <a4j:commandButton value= "Borrar" actionListener="#{seccionBean.eliminarClase}" reRender="horarioTable" style="border:0px;"/>
                        </h:panelGrid>
                    </a4j:outputPanel>
                    
                    <rich:spacer height="20px" style="border:0px"/>
                    <a4j:commandButton value="Registrar" action="#{seccionBean.insertar}"/>
                    
                </rich:tab>
                <rich:tab label="Modificar" actionListener="#{seccionBean.resetearBean}">    
                    MODIFICAR seccion
                </rich:tab>
                
                <rich:tab label="Eliminar" actionListener="#{seccionBean.resetearBean}">
                    ELIMINAR seccion
                </rich:tab>
                
                <rich:tab label="Buscar" actionListener="#{seccionBean.resetearBean}">
                    BUSCAR seccion
                </rich:tab>
            </rich:tabPanel>
            
        </h:form>
    </f:subview>
</div>